import Vue from 'vue'
import VueRouter from 'vue-router'
// 手动导入自己的组件(页面)
import Login from '../components/Login.vue'
import Home from '../components/Home.vue'
import User from '../components/user/user.vue'
import Welcome from '../components/Welcome.vue'
import ItemCat from '../components/items/ItemCat.vue'
import Item from '../components/items/Item.vue'
import AddItem from '../components/items/addItem.vue'

// 在Vue对象中声明路由对象，整个脚手架中都可以引用路由
Vue.use(VueRouter)
const routes = [
  {path: '/', redirect: '/login'},
  {path: '/login', component: Login},
  {path: '/home', component: Home, redirect:"/welcome",
   children:[
    {path: '/user', component: User},
    {path: '/welcome', component: Welcome},
    {path: '/itemCat', component: ItemCat},
    {path: '/item', component: Item},
    {path: '/item/addItem', component: AddItem}
  ]}
]

// 创建路由对象
const router = new VueRouter({
  routes
})

// 定义路由的导航守卫 考点：拦截器
/**
 * 遍历的每个路由都会执行回调函数
 * 参数信息：3个
 *          to:请求访问的地址  到哪儿去
 *          from：请求从哪里来  从哪来
 *          next：是一个函数   next() 表示请求放行
 *                            next("/login") 发起login请求
 */
router.beforeEach((to, from, next) => {
  // 如何访问登录页面直接放行
  if(to.path === "/login"){
    return next()
  }
  // 如果不是访问的登录页面，先判断用户是否登录，判断依据token
  let token = window.sessionStorage.getItem("token")
  // 判断token是否为空,如果token没有值，则执行if操作
  if(!token){
    return next("/login")
  }
  // 如果代码执行到这一行，说明用户已经登录，则放行
  next()

})

export default router
